<template>
  <div v-if="commonFields.length">

     <xdh-form size="small" :model="commonModel" :footer="false" label-width="80px" @change="handleChange" :edits="true">
      <xdh-form-item v-for="(item, index) in commonFields"
                     :key="index"
                     v-bind="item"></xdh-form-item>
    </xdh-form>
  </div>
  <div v-else>该组件无通用属性</div>
</template>

<script>
  import XdhForm from '@/widgets/xdh-form'
  import XdhFormItem from '@/widgets/xdh-form/xdh-form-item'
  import {mapGetters, mapState} from 'vuex'
  export default {
    components: {
      XdhForm,
      XdhFormItem
    },
     computed: {
      ...mapState(['editField']),
      ...mapGetters(['commonFields', 'commonModel'])
    },
    methods: {
      handleChange(props,old) {
        console.log('返回',props,old,this.editField)
        const newField = JSON.parse(JSON.stringify({
          ...this.editField,
          props: {...props}
        }))
        this.$store.commit('updateField', newField)
      }
    }

  }
</script>
